<template>
	<view>
		<!-- 登录 -->
		<view class="denglu">
			<text class="ri-arrow-left-s-line icon" @click="back"></text>
			<text class="t1">登录</text>
		</view>
		<!-- 还未登录 -->
		<view class="ning">
			<view class="view_1">
				<text>您还未登录</text>
			</view>
			<view class="view_2">
				<text>请先登录再进行操作</text>
			</view>
		</view>
		<!--  -->
		<view class="view_3">
			<text>* 未注册将获取您的公开信息（昵称、头像等）注册并登录</text>
		</view>
		<!-- 按钮 -->
		<view class="view_4">
			<button id="btn_1" plain="true" type="primary" @click="back">暂不登录</button>
			<button open-type="getUserInfo" id="btn_2" @click="getUserProfile">立即登录</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
			userInfo:"",
			hasUserInfo:true
			}
		},
		methods: {
			back() {
				uni.switchTab({
					url: "/pages/My/my"
				})
			},
			login() {
				uni.login({
					provider: 'weixin',
					success: function(loginRes) {
						console.log(loginRes.authResult);
					}
				});
			},
			getUserProfile(e) {
				// 推荐使用wx.getUserProfile获取用户信息，开发者每次通过该接口获取用户个人信息均需用户确认
				// 开发者妥善保管用户快速填写的头像昵称，避免重复弹窗
				uni.getUserProfile({
					desc: "用于完善会员资料", // 声明获取用户个人信息后的用途，后续会展示在弹窗中，请谨慎填写
					success: (res) => {
						
							this.userInfo=res.userInfo;
							this.hasUserInfo=true;
						const {
							userInfo
						} = res;
						uni.setStorageSync("userinfo", userInfo);
						uni.navigateBack({
							delta: 1,
						});
					},
				});
				console.log(this.userInfo);
			}
			

	},
	onShow() {
		
	},
	onLoad: function(options) {}
	}
</script>

<style lang="less">
	.denglu {
		display: flex;
		justify-content: space-between;
		width: 350rpx;
		height: 50rpx;
		margin: 110rpx 0 0 40rpx;

		.icon {
			margin-top: -3rpx;
			font-size: 60rpx;
		}

		.t1 {
			font-weight: 600;
			letter-spacing: 2rpx;
		}
	}

	.ning {
		margin: 180rpx auto;
		width: 300rpx;
		height: 200rpx;

		.view_1 {
			margin-left: 45rpx;
			margin-bottom: 20rpx;
			font-weight: 600;
			font-size: 30rpx;
			letter-spacing: 5rpx;
		}

		.view_2 {
			font-size: 25rpx;
			letter-spacing: 5rpx;
			color: #797676;
		}
	}

	.view_3 {
		font-size: 23rpx;
		letter-spacing: 3rpx;
		color: #797676;
		width: 700rpx;
		height: 30rpx;
		margin-left: 50rpx;
		padding-top: 180rpx;
	}

	.view_4 {
		display: flex;
		margin-top: 70rpx;

		#btn_1 {
			width: 200rpx;
			height: 60rpx;
			border: none;
			color: #3a8568;
			border: 1px solid #3a8568;
			font-size: 25rpx;
			margin-right: 10rpx;
		}

		#btn_2 {
			width: 200rpx;
			height: 60rpx;
			border: none;
			color: #FFFFFF;
			font-size: 25rpx;
			background: #3a8568;
			margin-left: 25rpx;
		}
	}
</style>
